<template>
  <div id="ioio">
    <div class="ioiA" @click="$router.push(`/jiangshi1?cid=${i.teacher_id}`)">
      <img :src="i.teacher_avatar" />
      <div>
        <p>{{ i.teacher_name }}</p>
        <p>{{ i.introduction }}</p>
      </div>
    </div>
    <!-- {{i}} -->
  </div>
</template>
<script>
  import infoIn from "@/views/infoin.vue";
export default {
  components:{
    infoIn
  },
  props: ["i"],
};
</script>
<style lang="scss" scoped>
.ioiA {
  width: 100%;
  height: 80px;
  background-color: white;
  margin-top: 10px;
  display: flex;
  align-items: center;
  img{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-left: 20px;
  }
  p{
    padding-left: 20px;
  }
  p:nth-child(1){
    font-size: 13px;
  }
  p:nth-child(2){
    font-size: 10px;
  }
}
</style>